/*gallery list*/



#gallery__logo-container {
  display: flex;
  overflow: auto;
  scrollbar-width: none; /*dla firefox*/
  margin-top: 50px;

  cursor: grab;
  user-select: none;
}

  #gallery__logo-container:active {
    cursor: grabbing;
  }


#gallery__logo-container::-webkit-scrollbar { /*Ukrycie scrolla z karuzeli*/
  display: none; /* Chrome, Safari, Edge */
}

.gallery__logo-list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2em;
  animation: spin 20s infinite linear;
  padding-right: 1em;
}

  .gallery-paused {
    animation-play-state: paused;
  }

.gallery__logo-item {
  flex: 1 1 0em;
  /*height: 5em;*/
  height: 300px;
  padding: 1em;
  background-color:  var(--white);
  font-size: 3rem;
  /*border-radius: .1em;*/
  text-align: center;
  align-content: center;
  /*cursor: pointer;  */
}

  .gallery__logo-item:last-child {
        margin-right: 1rem;
  }

    .gallery__logo-item img {
        max-height: 100%;
      pointer-events: none;

    }

    


@keyframes spin {
  from {translate: 0;}
  to { translate: -100%;}
}



/*loader*/

.gallery-loader {
    width: 50px;
    height: 50px;
    border: 4px solid #ddd;
    border-top-color: var(--orange);
    border-radius: 50%;
    animation: spin-loader 1s linear infinite;
}

@keyframes spin-loader {
    to {
        transform: rotate(360deg);
    }
}



/*popup*/

.gallery__popup {
    height: 100vh;
    width: 100vw;
    background-color: var(--white);

    position: absolute;
    top: 0;
    left: 0;
    z-index: var(--z-modal);

    flex-direction: row;
    flex-wrap: nowrap;
    display: none;
}

    .gallery__popup-active {
        display: flex;
    }

        .gallery__popup-close {
            cursor: pointer;
            position: absolute;
            right: 2rem;
            top: 2rem;
        }

        .gallery__popup-logo {
            height: 100vh;
            width: 60vw;
        }

        .gallery__popup-describe {
            height: 100vh;
            width: 40vw;
            background-color: var(--orange);

            display: flex;
            flex-direction: column;
            justify-content: space-evenly;

          }

            .gallery__popup-describe div {
              text-align: left;
              padding: 0 2rem;
            }

            .gallery__popup-describe div h2 {
              font-size: var(--font-hero);
            }
            .gallery__popup-describe div h3 {
              margin: 15px 0 0;
            }
        
        .gallery__popup-logo {
            background-color: var(--white);

            display: flex;
            justify-content: center;
            align-items: center;
        }

        .gallery__popup-logo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        @media (max-width: 768px) {

            .gallery__popup {
              flex-direction: column-reverse;
            }

            .gallery__popup-describe {
              width: 100vw;
              height: 70vh;
            }

             .gallery__popup-describe {
              overflow-y: auto;
             }

            .gallery__popup-describe div {
              padding: 0 1rem;
            }

            .gallery__popup-logo {
              width: 100vw;
              height: 30vh;
            }



        }